<template>
  <div class="table">
    <!--表2季度生产情况T_MulQuartProduc-->
    <Row>
      <div class="divSearch">
        <Row>
          <Col span="24" class="col-margin"> 填报年度：
          <Select v-model="searchModel.FillInYear" placeholder="全部" style="width: 100px" @on-change="getReportData()">
            <Option value="">全部</Option>
            <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictValue">{{item.DictText}}</Option>
          </Select>
          <Button icon="ios-search" type="ghost" @click="getReportData()" class="ButtonStyle">
            查询
          </Button>
          <Button icon="ios-download" type="primary" @click="ExcelDown()" class="searchButton" style="float:right;width: 100px;">数据导出</Button>
          <Upload :on-success="handleSuccess" :action="GetPostUrl()" style="float:right;width: 100px;" v-show="ReportStatus <3">
            <Button type="primary" icon="ios-cloud-upload-outline" class="searchButton">数据导入</Button>
          </Upload>
          <Button icon="ios-cloud-download" type="primary" @click="TmpDown()" class="searchButton" style="width: 100px;">模板下载</Button>
          <!-- <label style="float:right;padding: 6px;font-size:16px;">当前状态:
          <span v-if="ReportStatus==0" class="Error"></span> 
          <span v-else-if="ReportStatus==1" class="NoReport">未填写</span>
          <span v-else-if="ReportStatus==2" class="AlreadyReport">已填写</span>
          <span v-else-if="ReportStatus==3" class="UpReport">已上报</span>
          <span v-else-if="ReportStatus==4" class="Success">审核通过</span>               
      </label> -->
          </Col>
        </Row>
      </div>
    </Row>
    <!-- <Row style="padding-left: 10px;">
      <Col>
      <Button icon="plus" type="ghost" size="small" @click="addItem" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true">新增</Button>
      </Col>
    </Row> -->
    <Row>
      <table class="reptable">
        <caption>
            <label style="float:left">{{searchModel.FillInYear}}茧丝绸企业信息表</label>
            <label style="float:right">当前状态:
              <span v-if="ReportStatus==0" class="Error">重新填写</span> 
              <span v-else-if="ReportStatus==1" class="NoReport">未填写</span>
              <span v-else-if="ReportStatus==2" class="AlreadyReport">已填写</span>
              <span v-else-if="ReportStatus==3" class="UpReport">已上报</span>
              <span v-else-if="ReportStatus==4" class="Success">审核通过</span>   
              <span v-else class="NoReport">无需填报</span>                
            </label><br/>
             <label style="float:left;margin-bottom:5px">
               <Button icon="plus" type="ghost" size="small" @click="addItem" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true">新增</Button>
            </label> 
        </caption>
        <tr>
          <th>公司名称</th>
          <th>固定资产(万元)</th>
          <th>缫丝能力(绪)</th>
          <th>白厂丝产量(吨)</th>
          <th>丝绸产量(万米)</th>
          <th>年加工蚕丝被(吨)</th>
          <th>其它</th>
          <th>备注</th>
          <th>操作</th>
        </tr>
        <tr v-for="dataitem in datalist" :key="dataitem.Id">
          <td style="text-align:left;width:10%;">
            <Input style="display:none;" v-model="dataitem.Id"></Input>
            <Input style="display:none;" v-model="dataitem.ReportId"></Input>
            <Input v-model="dataitem.CompanyName" placeholder="公司名称"></Input>
          </td>
          <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.GDZC" placeholder="固定资产"></Input>
          </td>
          <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.CSNL" placeholder="缫丝能力"></Input>
          </td>
          <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.BCSCL" placeholder="白厂丝产量"></Input>
          </td>
          <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.SCCL" placeholder="丝绸产量"></Input>
          </td>
          <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.NJGCSB" placeholder="年加工蚕丝被"></Input>
          </td>
          <td style="text-align:right;width:5%;">
            <Input v-model="dataitem.Other" placeholder="其它"></Input>
          </td>
          <td style="text-align:right;width:15%;">
            <Input v-model="dataitem.Remark" placeholder="备注长度请小于150个字符..."></Input>
          </td>
          <td style="text-align:center;width:2%;">
            <Button type="ghost" size="small" icon="ios-trash-outline" style="color:#FF0000" @click="delOp(dataitem)" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true"></Button>
          </td>
        </tr>
      </table>
      <div class="divButton">
        <Button type="primary" @click="save()" :disabled="ReportStatus < 3 && BtnSaveStatus ? false:true">保存</Button>
        <Button type="primary" @click="DataUp()" :disabled="ReportStatus == 2 ? false:true">上报</Button>
      </div>
      <Alert banner type="error">
        <p style="color:red;">填报说明:</p>
        <p>注：1.除缫丝、丝绸、蚕丝被企业外，其余相关蚕桑制品企业生产的产品产量填入“其它”，并同时在备注里注明产品名称及单位；</p>
        <span slot="desc"></span>
      </Alert>
    </Row>
  </div>
  </template>

  <script>
    export default {
      data() {
        const validateNumber = (rule, value, callback) => {
          if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
          } else {
            if (value < 18) {
              callback(new Error('必须年满18岁'));
            } else {
              callback();
            }
          }
        };
        return {
          datalist: [],
          datas: {}, //table数据对象
          CreateYearList: this.GetGroupDict("ReportYear"), //上报年份
          CurrentYear: this.GetCurrentYear(), //当前年度
          ReportId: '',
          ReportStatus: '',
          BtnSaveStatus: false, //保存按钮开关
          //查询模型：根据需求删除不不要查询条件
          searchModel: {
            ReportCode: 'MulSilkCompany',
            FillInYear: '',
            AreaCode: this.GetlocaStorage("CSuserinfo").AreaCode
          }
        }
      },
      methods: {
        addItem() {//新增数据行
          var model = { //编辑模型
            Id: 0,
            ReportId: '',
            CompanyName: '',
            GDZC: '',
            CSNL: '',
            BCSCL: '',
            SCCL:'',
            NJGCSB:'',
            Other:'',
            Remark: ''
          };
          model.ReportId = this.ReportId;
          model.Id = this.datalist.length + 1;
          this.datalist.push(model);
        },
        delOp(m) {//删除数据行
          for (var i = 0; i < this.datalist.length; i++) {
            if (this.datalist[i].Id == m.Id) {
              this.datalist.splice(i, 1);
            }
          }
        },
        //数据上报
        DataUp() {
          var self = this;
          self.$Modal.confirm({
            title: '提示信息',
            content: '<p>数据上报后，不能再更改，是否继续上报？</p>',
            onOk: () => {
              var model = new Object();
              model.Id = self.ReportId;
              model.reportType = '3';
              model.strMsg = '';
              this.$http.post("Report/PostUpStatus", model).then(
                function (res) {
                  if (res.data.status == 1) {
                    self.$Notice.success({
                      title: '数据上报成功！',
                      desc: false
                    });
                    self.getReportData();
                  } else {
                    self.$Modal.error({
                      title: "提示信息",
                      content: "数据上报失败!"
                    });
                  }
                }
              );
            }
          });
        },
        getReportData() {
          var self = this;
          var user = this.GetlocaStorage("CSuserinfo");
          this.searchModel.AreaCode = user.AreaCode;
          if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
            this.searchModel.FillInYear = self.searchModel.FillInYear;
          } else {
            this.searchModel.FillInYear = self.CurrentYear + '年'; //填报年度-----数据字典值
          }
          self.$http.post('Report/PostPageList', this.searchModel).then(function (res) {
            if (res.data.status === 1) {
              if (res.data.rows.length > 0) {
                self.ReportId = res.data.rows[0].Id;
                self.ReportStatus = res.data.rows[0].Status;
                self.BtnSaveStatus = true;
              } else {
                self.ReportId = '';
                self.ReportStatus = '';
                self.BtnSaveStatus = false;
              }
              self.getPageData(self.ReportId);
            } else {
              self.$Modal.error({
                title: '提示信息',
                content: res.data.message
              });
            }
          });
        },
        //获取this.datas: {},//table数据对象
        getPageData(ReportId) {
          var self = this;
          var reportCode = self.searchModel.ReportCode;
          this.$http.get("Report", {
            params: {
              id: ReportId,
              reportCode: reportCode
            }
          }).then( //获取数据编辑项的值
            function (res) {
              switch (res.data.list.status) {
                case 1:
                  self.datalist = res.data.list.model;
                  break;
                case 0:
                  self.$Modal.error({
                    title: "提示信息",
                    content: "数据加载失败!!!"
                  });
                  break;
                case -1:
                  self.$Modal.error({
                    title: "提示信息",
                    content: "数据加载失败!!!"
                  });
                  break;
              }
            }
          );
        },
        //保存方法
        save() {
          var self = this;
          this.$http.post('MulSilkCompany', self.datalist).then(
            function (res) {
              if (res.data.status == 1) {
                self.getReportData(); //读取分页数据
                //self.datalist = [];
                self.$Notice.success({
                  title: '保存成功！',
                  desc: false
                });
              } else {
                self.$Modal.warning({
                  title: "提示信息",
                  content: "更新失败,请与管理员联系!"
                });
              }
            });
        },
        //导入
        GetPostUrl() {
          var url = this.$http.defaults.baseURL + "Report/PostImportData?ReportCode=" + this.searchModel.ReportCode +
            "&&AreaCode=" + this.searchModel.AreaCode;
          return url;
        },
        handleSuccess(res, file) {
          var self = this;
          self.getReportData();
          self.$Notice.success({
            title: '数据导入成功！',
            desc: false
          });
        },
        //导出
        ExcelDown: function () {
          var self = this;
          var model = new Object();
          model.ReportCode = self.searchModel.ReportCode;
          if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
            model.FillInYear = self.searchModel.FillInYear;
          } else {
            model.FillInYear = self.CurrentYear + '年'; //填报年度-----数据字典值
            self.searchModel.FillInYear = self.CurrentYear + '年';
          }
          model.AreaCode = self.searchModel.AreaCode;
          window.open(this.$http.defaults.baseURL + "MulSilkCompany/GetExcelData?ReportCode=" + model.ReportCode +
            "&&FillInYear=" + model.FillInYear + "&&AreaCode=" + model.AreaCode);
        },
        //模板下载
        TmpDown: function () {
          window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
      },
      //创建Vue页面方法
      created: function () {
        //创业Vue前调用获取this.datas: {},//table数据对象
        this.getReportData();
      },
      watch: {
        //需要监听的在此处新增监听对象
      }
    }

  </script>
